<markup>
<section data-view-id = "page1">
	<header>视图1</header>
	<div class = "time">
		<label>当前时间</label>
		<span></span>
	</div>
</section>
</markup>
<link rel = "stylesheet" href = "demo/css/common.css"/>
<style>
.time{
	padding: 0.2rem 0;
	text-align: center;
}
.time label{
	color: #999999;
	margin-bottom: 0.1rem;
	font-size: 1.2em;
}
.time span{
	display: block;
	font-size: 1.5em;
}
</style>
<script>
/* 向上下文中添加数据 */
;(function(){
	var v = View.ofId("page1");
	var timeSpanObj = v.find(".time span");

	/**
	 * 渲染当前时间
	 */
	var renderTime = function(){
		timeSpanObj.innerHTML = new Date().toLocaleTimeString();
	};

	/**
	 * 将方法句柄存放至上下文中。
	 *
	 * 我们建议只在同一视图内部存取上下文中的数据，不建议一个视图读取另外
	 * 一个视图的上下文上存储的数据。
	 * 如果视图之间需要共享数据或进行协作，请使用 视图参数 或 视图选项。
	 */
	v.context.set("renderTime", renderTime);
})();

/**
 * 从上下文中读取数据
 */
;(function(){
	var v = View.ofId("page1");

	/* 从上下文中读取句柄 */
	var renderTime = v.context.get("renderTime");

	/* 立即展现并周期性更新时间 */
	renderTime();
	setInterval(renderTime, 200);
})();
</script>